import { _decorator, Button, instantiate, Label, Node, ProgressBar, ScrollView, Sprite, UITransform, Vec3 } from 'cc';
import { ScrollList } from '../../../../frame/component/scroll.list';
import { BaseUI } from '../../../../frame/component/ui.base';
import GameDC from '../../../data/data.game.center';
import ConfManager from '../../../manager/config.manager';
import DataManager from '../../../manager/data.manager';
import { Popup } from '../pop-up';
const { ccclass, property } = _decorator;

@ccclass('UIAchieveRemove')
export class UIAchieveRemove extends BaseUI {

	private scroll: ScrollView;
	private scroll_list: ScrollList;
	private lbl_view: UITransform;

	private demo_lbl_desc: Node;
	private demo_lbl_underway: Node;
	private demo_lbl_diamond: Node;
	private demo_lbl_bar: Node;
	private demo_lbl_btn: Node;

	protected initAfterOnLoad(){
		this.init();
	}

	protected start(){
		this.adaptUI();
		this.initUIStatus();
		this.scroll.scrollToTop(0.1);
	}

	protected onEnable(){
		this.btn_lock = false;
		DataManager.ConfigInited.then(()=>this.renderList());
	}

	private btn_lock = false;
	protected _click_event_: { [name: string]: (this: UIAchieveRemove, button: Button) => void; } = {
		reap(btn){
			if(this.btn_lock){
				return void 0;
			}
			this.btn_lock = true;

			this.reapTask(btn);
		}
	}

	protected listening(){
		let list = [];
		return list;
	}

	private init(){
		this.scroll = this.node.getChildByName('scroll-view').getComponent(ScrollView);
		this.scroll_list = this.scroll.getComponent(ScrollList);
		this.lbl_view = this.scroll.content.parent.getChildByName('labels').getComponent(UITransform);

		this.demo_lbl_desc = this.lbl_view.node.getChildByName('lbl-desc');
		this.demo_lbl_underway = this.lbl_view.node.getChildByName('lbl-underway');
		this.demo_lbl_diamond = this.lbl_view.node.getChildByName('lbl-diamond');
		this.demo_lbl_bar = this.lbl_view.node.getChildByName('lbl-bar');
		this.demo_lbl_btn = this.lbl_view.node.getChildByName('lbl-btn');

		[this.demo_lbl_desc, this.demo_lbl_underway, this.demo_lbl_diamond, this.demo_lbl_bar, this.demo_lbl_btn].forEach(n=>n.active = false);

		this.scroll_list.onInitItem(this.initItem, this);
		this.scroll_list.onRenderItem(this.renderItem, this);
		this.scroll_list.onRefreshContent(this.onRefreshContent, this);
		this.scroll_list.onScrollCall(this.onScroll, this);
	}

	private adaptUI(){
		let ui_parent = this.node.parent.getComponent(UITransform);
		this.node.getComponent(UITransform).setContentSize(ui_parent.width / 3, ui_parent.height);

		let view_width = ui_parent.width * 1008 / 1080 / 3;
		let view_height = ui_parent.height;
		this.scroll.node.getComponent(UITransform).setContentSize(view_width, view_height);
		this.scroll.node.getChildByName('background').getComponent(UITransform).setContentSize(view_width, view_height);
		this.scroll.node.getChildByName('fake-collar').getComponent(UITransform).width = view_width;
		this.scroll.content.parent.parent.getComponent(UITransform).setContentSize(view_width-30, view_height-15);
		this.scroll.content.parent.getComponent(UITransform).setContentSize(view_width-30, view_height-115);

		DataManager.ConfigInited.then(()=>this.renderList());
	}

	private initUIStatus(){
		this.node.setPosition(mtec.cc.VecAssist.getPosition(this.node, 'right', 'center'));

		this.scroll.node.setPosition(mtec.cc.VecAssist.getPosition(this.scroll.node, 'center', 'bottom'));

		let fake_coller = this.scroll.node.getChildByName('fake-collar');
		fake_coller.setPosition(mtec.cc.VecAssist.getPosition(fake_coller, 'center', 'top'));
		let background = this.scroll.node.getChildByName('background');
		background.setPosition(mtec.cc.VecAssist.getPosition(background, 'center', 'top'));

		let va_view = new mtec.cc.VecAssist(this.scroll.content.parent);
		va_view.getPosition('center', 'bottom');
		va_view.vec.add3f(0, 50, 0);
		this.scroll.content.parent.setPosition(va_view.vec);
	}

	private renderList(){
		this.scroll_list.setDataList(ConfManager.otherConf.taskRemove.filter(el=>!GameDC.checkTask('remove', el.count)), 'count');
		this.scroll.scrollToTop(0.1);
	}

	private renderItem(view: ScrollView, node: Node, data: typeof ConfManager.otherConf.taskRemove[number], cache_map: Map<Node, ItemCache>){
		let cache = cache_map.get(node);

		[cache.vec_lbl_bar, cache.vec_lbl_desc, cache.vec_lbl_diamond, cache.vec_lbl_underway, cache.vec_lbl_btn].forEach(v=>v.set(node.position));
		cache.vec_lbl_desc.add3f(-419, 57.5, 0);
		cache.vec_lbl_diamond.add3f(376.5, 58, 0);
		cache.vec_lbl_bar.add3f(-136.5, -30.5, 0);
		cache.vec_lbl_underway.add3f(329, -37, 0);
		cache.vec_lbl_btn.add3f(329, -37, 0);

		cache.lbl_desc.node.setPosition(cache.vec_lbl_desc);
		cache.lbl_underway.node.setPosition(cache.vec_lbl_underway);
		cache.lbl_diamond.node.setPosition(cache.vec_lbl_diamond);
		cache.lbl_bar.node.setPosition(cache.vec_lbl_bar);
		cache.lbl_btn.node.setPosition(cache.vec_lbl_btn);

		cache.lbl_desc.string = 'Matching 40 times'.replace('40', data.count.toString());
		cache.lbl_diamond.string = data.diamond.toString();
		cache.lbl_bar.string = Math.min(data.count, GameDC.Cache.remove_count) + ' / ' + data.count;
		let progress = Math.min(1, GameDC.Cache.remove_count / data.count);
		cache.bar.progress = progress;

		let full = progress >= 1;
		let done = GameDC.checkTask('remove', data.count);

		cache.btn_reap.node.active = full;
		cache.lbl_btn.node.active = full;
		cache.lbl_underway.node.active = !full;
		cache.spt_btn_reap.grayscale = done;
		cache.btn_reap.interactable = !done;
	}

	private initItem(view: ScrollView, node: Node, cache_map: Map<Node, ItemCache>){
		cache_map.set(node, this.createItemCache(node));
	}

	private onScroll(view: ScrollView, ui_content: UITransform){
		this.lbl_view.node.setPosition(ui_content.node.position);
	}

	private onRefreshContent(view: ScrollView, ui_content: UITransform){
		this.lbl_view.setContentSize(ui_content.contentSize);
		this.lbl_view.anchorPoint.set(ui_content.anchorPoint);
		this.lbl_view.node.setPosition(ui_content.node.position);
	}

	private createItemCache(item: Node){
		let cache: ItemCache = {
			lbl_desc: instantiate(this.demo_lbl_desc).getComponent(Label),
			lbl_underway: instantiate(this.demo_lbl_underway).getComponent(Label),
			lbl_diamond: instantiate(this.demo_lbl_diamond).getComponent(Label),
			lbl_bar: instantiate(this.demo_lbl_bar).getComponent(Label),
			lbl_btn: instantiate(this.demo_lbl_btn).getComponent(Label),
			vec_lbl_desc: new Vec3(),
			vec_lbl_underway: new Vec3(),
			vec_lbl_diamond: new Vec3(),
			vec_lbl_bar: new Vec3(),
			vec_lbl_btn: new Vec3(),
			bar: item.getChildByName('bar').getComponent(ProgressBar),
			btn_reap: item.getChildByName('reap').getComponent(Button),
			spt_btn_reap: item.getChildByName('reap').getComponent(Sprite)
		};

		cache.lbl_underway.string = 'On Mission';
		cache.lbl_btn.string = 'CLAIM';

		[cache.lbl_desc, cache.lbl_underway, cache.lbl_diamond, cache.lbl_bar, cache.lbl_btn].forEach(lbl=>{
			lbl.node.setParent(this.lbl_view.node);
			lbl.node.active = true;
		});

		return cache;
	}

	private async reapTask(btn: Button){
		let item = btn.node.parent;
		let data = ConfManager.otherConf.taskRemove.find(el=>String(el.count) == item.name);

		if(!GameDC.checkTask('remove', data.count)){
			GameDC.recordTask('remove', data.count);
			btn.getComponent(Sprite).grayscale = true;

			let diamond = await Popup.DiamondFruit(data.diamond);

			DataManager.changeDiamond(diamond);
			DataManager.floatDiamond(diamond, mtec.cc.canvas.node.position);
		}

		this.btn_lock = false;
	}
}

type ItemCache = {
	lbl_desc: Label;
	lbl_underway: Label;
	lbl_diamond: Label;
	lbl_bar: Label;
	lbl_btn: Label;
	vec_lbl_desc: Vec3;
	vec_lbl_underway: Vec3;
	vec_lbl_diamond: Vec3;
	vec_lbl_bar: Vec3;
	vec_lbl_btn: Vec3;
	bar: ProgressBar;
	btn_reap: Button;
	spt_btn_reap: Sprite;
}
